<template>
  <div>
    <div class="head"></div>
    <div>
      <h2 class="mdesn1">剧情简介</h2>
    </div>
    <div
     class="mdesn2"
    >
      <span class="mdesn3">
        {{ mDesn }}
      </span>
    </div>
  </div>
</template>
<script setup>
import axios from 'axios'
import { ref, onMounted } from 'vue'
const mDesn = ref()
onMounted(() => {
  const movieName = JSON.parse(sessionStorage.getItem('movieInfo'))
  axios.get('/api/movie/getMovieByMname/' + movieName).then((res) => {
    if (res.data !== null) {
      mDesn.value = res.data[0].desn
    } else {
      ElMessage({
        showClose: true,
        message: '网络错误！',
        type: 'error'
      })
    }
  })
})
</script>
<style lang="scss" scoped>
.head {
  width: 20px;
  height: 50px;
  background-color: burlywood;
  margin-left: -330px;
  margin-top: 50px;
  display: flex;
  float: left;
}
.mdesn1{
  display: flex; float: left; margin-top: 60px; margin-left: -300px
}
.mdesn2{
        width: 700px;
        height: 200px;
        display: flex;
        float: left;
        background-color: white;
        margin-top: 100px;
        margin-left: -300px;
}
.mdesn3{
  display: flex; float: left; text-align: left
}
</style>
